<template>
	<view class="serve">
		<view class="header">
			<view class="bar">
				<text @click="skipInformation">资讯推送</text>
			</view>
		</view>
		<view class="serve-content">
			<informationVue></informationVue>
		</view>
	</view>
</template>

<script setup>
	import informationVue from '@/components/serve/information/information.vue'
</script>

<style lang="scss" scoped>
	.serve {
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		background-color: #fff;
	}

	.header {
		position: fixed;
		z-index: 1000;
		/* 确保在最顶层 */
		top: 0;
		left: 0;
		right: 0;
		background: linear-gradient(180deg, #54a7ff, rgba(255, 255, 255, 0.8));
		height: 13%;
		color: black;
	}

	.bar {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-evenly;
		margin-top: 15%;
	}

	text {
		text-align: center;
		width: 30%;
		height: 60rpx;
		font-size: 35rpx;
		line-height: 60rpx;
		font-weight: bold;
	}

	.serve-content {
		max-height: 100%;
		margin-top: 28%;
	}
</style>